<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="static\css\注册界面.css">
    <title>注册</title>
</head>
<body>
    <div id="regist_box">
        <div class="title"><h1>Regist</h1></div>
        <form method="post" action="/user-info/register">
        <div class="input_box">
            <input type="text" placeholder="name" class="name" name="userName">
        </div>
        <div class="input_box">
            <input type="text" placeholder="userPhone" class="phone" name="userPhone">
        </div>
        <div class="input_box">
            <input type="text" placeholder="sex" class="sex" name="userSex">
        </div>
        <div class="input_box">
            <input type="password" placeholder="password" class="pad" name="userPwd" maxlength="8">
        </div>
        <div class="regist_btn">
            <button type="submit">REGISTER</button>
        </div>
        </form>
    </div>

    <script>
        var regist_btn = document.querySelector('.regist_btn');
        var sex = document.querySelector('.sex');
        var pad = document.querySelector('.pad');
        var name = document.querySelector('.name');
        var age = document.querySelector('.age');
        var pad_length = pad.value.length;

        regist_btn.addEventListener('click',function(){
            if(sex.value=='男' || sex.value=='女'){
                alert('注册成功！');
                location.assign('login.html');
            }else if(sex.value=='' || pad.value=='' || name.value=='' || age.value==''){
                alert('请输入完整信息！！！');
            }else if(sex.value!='男'|| sex.value!='女'){
                alert('性别填写错误，请重新填写！！！');
            }
        })
    </script>
</body>
</html>